﻿
@{
    ViewData["Title"] = "Overviews";
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>总览</title>
    <meta name="keywords">
    <meta name="description">

    <link href="~/BootstrapS/css/bootstrap.min14ed.css" rel="stylesheet" />
    <link href="~/BootstrapS/css/font-awesome.min93e3.css" rel="stylesheet" />
    <link href="~/BootstrapS/css/animate.min.css" rel="stylesheet" />
    <link href="~/BootstrapS/css/style.min862f.css" rel="stylesheet" />
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content">
        <div class="row">
            <div class="col-sm-3">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <i class="fa fa-wheelchair" style="float:right;font-size:20px;color:tomato"> </i>
                        <h5>患者</h5>
                    </div>
                    <div class="ibox-content">
                        <h1 class="no-margins">176</h1>
                        <div class="stat-percent font-bold text-success">
                            13842 <i class="fa fa-wheelchair"></i>
                        </div>
                        <small>患者统计</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <i class="fa fa-stethoscope" style="float:right;font-size:20px;color:turquoise"> </i>
                        <h5>出诊</h5>
                    </div>
                    <div class="ibox-content">
                        <h1 class="no-margins">437</h1>
                        <div class="stat-percent font-bold text-info">
                            37694 <i class="fa fa-stethoscope"></i>
                        </div>
                        <small>出诊统计</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <i class="fa fa-usd" style="float:right;font-size:20px;color:deeppink"></i>
                        <h5>收入</h5>
                    </div>
                    <div class="ibox-content">
                        <h1 class="no-margins">13872</h1>
                        <div class="stat-percent font-bold text-navy">
                            294674 <i class="fa fa-usd"></i>
                        </div>
                        <small>收入统计</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <i class="fa fa-hospital-o" style="float:right;font-size:20px;color:black"> </i>
                        <h5>病房</h5>
                    </div>
                    <div class="ibox-content">
                        <h1 class="no-margins">104</h1>
                        <div class="stat-percent font-bold text-danger">
                            548 <i class="fa fa-hospital-o"></i>
                        </div>
                        <small>病房统计</small>
                    </div>
                </div>
            </div>
        </div>
    </div>


    @*出诊周统计*@
    <div id="b" style="height:290px;width:47.5%;background-color:white;margin-left:20px">
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.min.js"></script>
        <script type="text/javascript">
            var dom = document.getElementById("b");
            var myChart = echarts.init(dom);
            var app = {};
            option = null;
            option = {
                title: {
                    text: '出诊周统计',
                },

                color: ['#009688'],
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                    }
                },
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                xAxis: [
                    {
                        type: 'category',
                        data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
                        axisTick: {
                            alignWithLabel: true
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value'
                    }
                ],
                series: [
                    {
                        name: '出诊数',
                        type: 'bar',
                        barWidth: '60%',
                        data: [98, 107, 113, 76, 124, 176, 143]
                    }
                ]
            };
            ;
            if (option && typeof option === "object") {
                myChart.setOption(option, true);
            }
        </script>
    </div>

    @*病者周统计*@
    <div id="c" style="height:290px;width:47.5%;background-color:white;margin-top:-290px;float:right;margin-right:20px">
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.min.js"></script>
        <script type="text/javascript">
            var dom = document.getElementById("c");
            var myChart = echarts.init(dom);
            var app = {};
            option = null;
            option = {
                title: {
                    text: '病者周统计',
                },

                color: ['#e91e63'],
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                    }
                },
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                xAxis: [
                    {
                        type: 'category',
                        data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
                        axisTick: {
                            alignWithLabel: true
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value'
                    }
                ],
                series: [
                    {
                        name: '病者数',
                        type: 'bar',
                        barWidth: '60%',
                        data: [53, 42, 31, 27, 47, 67, 89]
                    }
                ]
            };
            ;
            if (option && typeof option === "object") {
                myChart.setOption(option, true);
            }
        </script>
    </div>

    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <label>今日出诊</label>
                <input type="text" placeholder="请输入医生名称" class="input-sm form-control" style="width:180px;height:34px;margin-left:950px">
                <button class="btn btn-info " type="button" style="margin-left:190px;margin-top:-48px;margin-left:1140px">
                    <i class="fa fa-map-pin"></i> 查询
                </button>
            </div>

            <div class="ibox-content">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th>患者</th>
                            <th>医生</th>
                            <th>项目</th>
                            <th>日期</th>
                            <th>时间</th>
                            <th>状态</th>
                        </tr>
                    </thead>

                    <tr>
                        <td>刘志超</td>
                        <td>高孝峰</td>
                        <td>牙科</td>
                        <td>2020-04-08</td>
                        <td>18:46:21</td>
                        <td>出诊中</td>
                    </tr>

                    <tr>
                        <td>刘志超</td>
                        <td>高孝峰</td>
                        <td>牙科</td>
                        <td>2020-04-08</td>
                        <td>18:46:21</td>
                        <td>出诊中</td>
                    </tr>

                    <tr>
                        <td>刘志超</td>
                        <td>高孝峰</td>
                        <td>牙科</td>
                        <td>2020-04-08</td>
                        <td>18:46:21</td>
                        <td>出诊中</td>
                    </tr>

                    <tr>
                        <td>刘志超</td>
                        <td>高孝峰</td>
                        <td>牙科</td>
                        <td>2020-04-08</td>
                        <td>18:46:21</td>
                        <td>出诊中</td>
                    </tr>

                    <tr>
                        <td>刘志超</td>
                        <td>高孝峰</td>
                        <td>牙科</td>
                        <td>2020-04-08</td>
                        <td>18:46:21</td>
                        <td>出诊中</td>
                    </tr>
                    <tbody id=""></tbody>
                </table>
            </div>
        </div>
    </div>

    <script src="~/BootstrapS/js/jquery.min.js"></script>
    <script src="~/BootstrapS/js/bootstrap.min.js"></script>
    <script src="~/BootstrapS/js/plugins/metisMenu/jquery.metisMenu.js"></script>
    <script src="~/BootstrapS/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
    <script src="~/BootstrapS/js/plugins/layer/layer.min.js"></script>
    <script src="~/BootstrapS/js/hplus.min.js"></script>
    <script src="~/BootstrapS/js/contabs.min.js"></script>
    <script src="~/BootstrapS/js/plugins/pace/pace.min.js"></script>
</body>
</html>

